<template>
   <div class="wy-main business-car-manage">
       <!--标题-->
       <a-row class="wy-main-title">
           <a-col :span="24">
               <p class="title-p">
                   <a-divider class="title-vertical"  type="vertical" />
					<span class="title-span" >管理我的城市货运车源</span>
					<a-divider class="title-divider"  />
               </p>
           </a-col>
       </a-row>
       <!--列表内容-->
       <!--搜素框-->
       <div>
           <a-input style="width: 200px;"  placeholder="请输入车牌号" v-model="licence"></a-input>
           <a-button type="primary" style="margin-left: 10px;" @click="getcarSource">点击查询</a-button>
			<a-button style="margin-left: 10px;" @click="reset">重置信息</a-button>
			<router-link to="/business/car/cityInformation">
				<a-button type="primary" style="float: right;">新增车源</a-button>
			</router-link>
       </div>
       <div class="route_choice manage_car">
           <a-table :columns="columns" :dataSource="cardata"  :rowKey="record => record.urbanFreightId" :pagination="pagination" :loading="loading"  @change="handleTableChange" :rowSelection="{selectedRowKeys: selectedRowKeys,onChange: onSelectChange}">
                <!-- <span>{{record.createTime.split(" ")[0]}}</span> -->
               <!--操作-->
                <span slot="approvalStatusValue" slot-scope="text,record">
                    <span v-if="text == '待审批'" style="color: #ffa60b;">待审核</span>
                    <span  v-if="text == '不通过'" style="color:  #ff2f47;">审核失败</span>
                    <span v-if="text == '通过'" style="color: #15837A;">审核通过</span>
                </span>
               <span slot="action" slot-scope="text, record">
			      <a href="javascript:;" @click="seeInfo(record)">查看</a>
			      <a-divider type="vertical" />
			      <a href="javascript:;" @click="edit(record)"> 修改</a>
			      <a-divider type="vertical" />
			      <a href="javascript:;" @click="delcarSource(record)" > 删除</a>
			    </span>
                <span slot="releaseDateSplit" slot-scope="text, record">
                <span v-if="!!record.createTime">{{record.createTime.split(" ")[0]}}</span>
              </span>
           </a-table>
       </div>
       <div style="margin-top: -50px">
           <a-button @click="delcars">删除所选</a-button>
       </div>
       <a-modal :title="type == 'edit' ? '编辑' : '查看'" :visible="visible" @cancel="handleCancel" width="900px" :maskClosable='false' :footer="null">
         <city-add v-if="visible" 
			:isSee='isSee' :datail='datail' @close="close" :type='type'></city-add>
       </a-modal>
   </div>
</template>
<script>
import cityAdd from "./components/CityAdd";
const columns = [{
    title: '车牌号',
    width: 100,
    dataIndex: 'licence',
    key: 'licence' ,
    scopedSlots: {
        customRender: 'licence'
    }
},{
    title: '服务城市',
    width: 100,
    dataIndex: 'city',
    key: 'city' ,

},{
    title: '服务类型',
    width: 100,
    dataIndex: 'serviceTypesValue',
    key: 'serviceTypesValue' ,
},{
    title: '驾驶员',
    width: 100,
    dataIndex: 'driverName',
    key: 'driverName' ,
},{
    title: '起运价',
    width: 100,
    dataIndex: 'startingPrice',
    key: 'startingPrice' ,

},{
    title: '审核状态',
    width: 100,
    dataIndex: 'approvalStatusValue',
    key: 'approvalStatusValue' ,
    scopedSlots: {
    customRender: 'approvalStatusValue'
}
},{
    title: '发布日期',
	dataIndex: 'createTime',
	width:100,
    key: 'createTime',
    scopedSlots: {
      customRender: 'releaseDateSplit'
    },
},{
    title: '操作',
	width:170,
	key: '0',
	scopedSlots: {
			customRender: 'action'
		},
}];
export default {
    data() {
        return {
            isSee:true,
            type:'',
            columns,
            loading: false,
            visible:false,
            datail:{},
            cardata:[],
            licence:'',
            
            pagination: {
				pageSizeOptions: ['10', '20', '30', '40', '100'],
				defaultCurrent: 1,
				defaultPageSize: 10,
				total:0,
				showSizeChanger: true,
				showTotal: (total, range) => `共 ${total} 条记录`
            },
            selectedRowKeys: [],
        }
    },
    computed: {
        

    },
    beforeCreate() {},
    created() {
        this.getcarSource()

    },
    components: {
        cityAdd

    },
    watch: {

    },
    mounted: function () {
        
    },
    methods: {
          //重置
        reset(){
            this.licence = '',
            this.getcarSource()

        },
        //修改完成刷新数据
        close (data) {
            this.visible = false
            this.getcarSource()

        },
        //关闭弹框
        handleCancel() {
            this.visible = false
        },
        //获取城市货运车源信息列表
        getcarSource(params={}){
            // this.loading = true
            params.pagesize = this.pagination.defaultPageSize
            params.pageNum = this.pagination.defaultCurrent
            if(this.licence){
            params.licence = this.licence
            }
            this.$get('/info/urbanFreight',params).then((r) => {
                console.log(r)
                // this.loading = false
                this.cardata = r.data.data.rows
                this.pagination.total = r.data.data.total
            })
        },
      
        //删除所选
        	delcars(){
				 if (!this.selectedRowKeys.length) {
				  this.$message.warning('请选择需要删除的记录')
				  return
				}
				let that = this
				this.$confirm({
				  title: '确定删除所选中的记录?',
				  content: '当您点击确定按钮后，这些记录将会被彻底删除',
				  centered: true,
				  onOk () {
				    let cityIds = that.selectedRowKeys
					that.$delete('/info/urbanFreight/' + cityIds.join(',')).then(() => {
				      that.$message.success('删除成功')
				      that.selectedRowKeys = []
				      that.getcarSource()
				    })
                  },
                  onCancel () {
				    that.selectedRowKeys = []
				  }
			   })
			},
        //删除单条信息
        delcarSource(data){
            console.log(data)
            let that = this
            this.$confirm({
                title: '确定删除所选中的记录?',
                content: '当您点击确定按钮后，这些记录将会被彻底删除',
                centered: true,
                onOk () {
                    let cityIds = []
                    cityIds.push(data.urbanFreightId)
                    that.$delete('/info/urbanFreight/' + cityIds.join(',')).then(() => {
                        that.$message.success('删除成功')
                        that.selectedRowKeys = []
                        that.getcarSource()
                        
                    })
                },
                onCancel () {
				    that.selectedRowKeys = []
				  }
            })


        },
        //查看
        seeInfo(data){
            this.type = 'info'
            this.visible = true
            this.isSee = true
            this.datail = data

        },
        //修改
        edit(data){
            this.type ='edit'
            this.visible = true
            this.isSee = false
            this.datail = data

        },
        //全选事件
        onSelectChange (selectedRowKeys) {
		      console.log('selectedRowKeys changed: ', selectedRowKeys);
		      this.selectedRowKeys = selectedRowKeys
        },
        // 表格排序 分页 筛选事件
			handleTableChange (pagination, filters, sorter) {
			   this.pagination.defaultPageSize = pagination.pageSize
			   this.pagination.defaultCurrent  = pagination.current
			   this.getcarSource()
        },
    }
}
</script>

<style lang="less" scoped>
	.business-car-manage {
		.route_choice {
			margin-top: 20px;
		}
	}
</style>


